<template>
  <div class="subjectScoreView"> 
    <head-Menu></head-Menu>
    <div class="SSVContainer">
      <el-collapse accordion>
        <el-collapse-item v-for="(EFData, i) in EFList" >
          <template slot="title">
            <span class="EFList">{{EFData}}</span>
          </template>
          <el-table :data="examInfList[i].examInf" style="width: 100%;">
            <el-table-column label="考试文件" prop="examFileName" show-overflow-tooltip></el-table-column>
            <el-table-column label="考试名" prop="examName" show-overflow-tooltip></el-table-column>
            <el-table-column label="课目" prop="subject" show-overflow-tooltip></el-table-column>
            <el-table-column label="考试班级" show-overflow-tooltip>
              <template slot-scope="scope">{{classesList[i]}}</template>
            </el-table-column>
            <el-table-column label="已批改/总人数" show-overflow-tooltip>
              <template slot-scope="scope">{{examInfList[i].examInf[scope.$index].completedNum}}/{{examInfList[i].totalNum}}</template>
            </el-table-column>
            <el-table-column width=160 >
              <template  slot-scope="scope">
                <span v-if="examInfList[i].examInf[scope.$index].completedNum == examInfList[i].totalNum">
                  <el-button @click="toScoreTable(scope.row)" type="primary" icon='el-icon-edit' size="medium" round>查看成绩表</el-button>
                </span>
                <span v-else>
                <el-button type="primary" icon='el-icon-edit' size="medium" disabled round>暂无成绩表</el-button>
                </span>
              </template>
            </el-table-column>
          </el-table>
        </el-collapse-item>
      </el-collapse>
    </div>
  </div>
</template>

<script>
import headMenu from '../../components/headMenu.vue'
import { getExamFile, getexamInf } from "../../api/user";
import { Toast } from "vant";
export default {
  data() {
    return {
      EFList: [],
      classesList: [],
      examInfList: [],
    }
  },
  components: {
    headMenu
  },
  props: {
    params: {
        type: Object,
        default:{}
    }
  },
  created() {
    this.getExamFile()
  },
  methods: {
    async getExamFile() {
      await getExamFile()
        .then((res) => {
          this.EFList = res.examFileName
          this.classesList = res.classesList
          this.getexamInf(res.examList)
        })
    },
    async getexamInf(inf) {
      await getexamInf({
        textPaper: inf,
        examFileName: this.EFList,
        classesList: this.classesList
      })
        .then((res) => {
          this.examInfList = res.examInfList
          console.log(res.examInfList);
        })
    },
    toScoreTable(row) {
      sessionStorage.setItem('toSubjectScoreTable', JSON.stringify({ examFileName: row.examFileName, examName: row.examName }))
      this.$router.push({
        path:'/teacher/subjectScoreTable',
      })
    },
  },
}
</script>

<style lang='stylus'>
.subjectScoreView
  flex 1 1 100%
  display block
  .SSVContainer
    margin 0 10px
    border 1px solid #CCCCCC  
    text-align center
    .EFList
      margin-left 10px
      font-weight 600
      font-size 16px
      font-family '黑体'
</style>